/* 全てのページに適用 */
html {
    max-width: 1000px;
    font-size: 20px;
    font-family: ゴシック720;
    background-color: rgb(255, 240, 220);
}

/* 　全ての要素に対して　 */
* {                          
    box-sizing: border-box;  /*padding と border を要素に含める*/
}


/*  Main Menu  */
.nav1{
    font-weight: bold;
    color: blue;
    line-height: 0.5;        /* 0.5 がちょうどよい ? */
}
.nav1 ul{
    margin: 20px 0 0 20px;   /*  　上・左の余白　                */
    padding: 0;              /*  　なければ、右へ寄る（なぜ？）　  */
    list-style: none;        /*  　装飾なし　                    */
    display: flex;           /*  　横並び　                      */
    justify-content: start;  /*  　左寄せ　                      */
    gap: 30px;               /*  　間隔　                        */
}


/*  　健康への道しるべ　  */
.title2{                           /*  　背景写真と色は、個別設定で　                 */  
    font-size: 32px;
    text-align: left;
    padding: 10px 0 150px 30px;    /*  　下方の値が画像の大きさを決める　              */
    background-repeat: no-repeat;  /*  　縦・横のどちらかが余っても、反復しない　       */
    /*background-size: contain;*/  /*  　画像全体を伸縮させて表示するが　              */
                                   /*  photoshop で画像を 1000px にしたので不要に     */
}


/*  　内容の補足（より深い理解のために）　  */
.title3{
    /*  　背景　  */
        position: absolute;
        left: 6px;                    
        top: 217px;
        width: 988px;
        height: 33px;
        background-color: #990000;
    /*  　文字　  */
        padding: 3px 0 0 20px;
        text-align: left;
        font-size: 22px;
        color: white;
}


/*  　項目メニュー　  */
.nav2{
    position: absolute;
    top: 300px;
    left: 0px;
    line-height: 0.5;
}
.段落3{  /*1 ○部 2 栄養,疾患,他 3 テーマ*/
    position: relative;
    left: 110px;
    font-weight: bold;
    line-height: 0.5;
}


/* 個別のスタイル */
.health{
    color: blue;
    background-image: url(../../images/health.jpg);
}


a:link{                  /*  　未訪問のリンク　  */
    color:black;
    text-decoration: none;
}
a:visited{               /*  　訪問済のリンク　  */
    color:black;
    text-decoration: none;
}
a:hover{                 /*  　マウス中のリンク　  */
    color:blue;
    text-decoration: underline;
}
a:active{                /*  　実行中のリンク　  */
    color:blue;
    text-decoration: underline;
}